<template>
  <el-select v-model="content" placeholder="请选择" @change="onChange" filterable :style="style" :disabled="disabled">
    <el-option v-for="dict in studentInfoList" :key="dict.id" :label="dict.realName" :value="dict.id"></el-option>
  </el-select>
</template>

<script setup lang="ts">
import { propTypes } from '@/utils/propTypes';
import { listStudent, getStudent, delStudent, addStudent, updateStudent } from '@/api/office/student';
import { StudentVO, StudentQuery, StudentForm } from '@/api/office/student/types';

const props = defineProps({
  modelValue: propTypes.string,
  status: propTypes.string,
  disabled: {
    type: Boolean,
    default: false
  },
  style: {
    type: Object,
    default: () => {
      return { width: '240px' };
    }
  }
  // width: propTypes.string.def("240") || propTypes.number.def(240)
});

const studentInfoList = ref<StudentVO[]>([]);
const queryParams = reactive<StudentQuery>({
  pageNum: 1,
  pageSize: 10000,
  account: undefined,
  realName: undefined,
  facePicStatus: undefined,
  gender: undefined,
  classId: undefined,
  facultyId: undefined,
  dormId: undefined,
  eCardNo: undefined,
  studentNo: undefined,
  status: undefined,
  accommodationType: undefined,
  subscribeStatus: undefined
});

const content = ref('');
watch(
  () => props.modelValue,
  (v) => {
    if (v != content.value) {
      content.value = v;
    }
  },
  { immediate: true }
);

watch(
  () => props.status,
  (v) => {
    if (v != queryParams.status) {
      queryParams.status = v;
    }
  },
  { immediate: true }
);

const emit = defineEmits(['change', 'update:modelValue']);

const onChange = (data: any) => {
  emit('change', data);
  emit('update:modelValue', data);
};

/** 查询宿舍楼列表 */
const getList = async () => {
  const res = await listStudent(queryParams);
  studentInfoList.value = res.rows;
};

const clear = () => {
  content.value = '';
  emit('update:modelValue', content.value);
};

onMounted(() => {
  if (props.status) {
    queryParams.status = props.status;
  }
  getList();
});
</script>

<style scoped></style>
